<template>
	<view class="gradens-yhrw-view">
		<view class="gradens-yhrw-view-card">
			<view class="yhrw-view-list-item">
				<view class="yhrw-view-list-name">计划名称:</view>
				<text class="yhrw-view-list-text">{{weekInfo.planName}}</text>
			</view>
			<view class="yhrw-view-list-item">
				<view class="yhrw-view-list-name">计划类型:</view>
				<text class="yhrw-view-list-text">{{weekInfo.type}}</text>
			</view>
			<view class="yhrw-view-list-item">
				<view class="yhrw-view-list-name">起止时间:</view>
				<text class="yhrw-view-list-text">{{weekInfo.startTime | date('yyyy/mm/dd')}} ~ {{weekInfo.endTime | date('yyyy/mm/dd')}}</text>
			</view>
			<view class="yhrw-view-list-item">
				<view class="yhrw-view-list-name">任务状态:</view>
				<text class="yhrw-view-list-text">{{weekInfo.status}}</text>
			</view>
			<view class="yhrw-view-list-item">
				<view class="yhrw-view-list-name">日期:</view>
				<text class="yhrw-view-list-text">{{weekInfo.startTime | date('yyyy年mm月dd日')}} </text>
			</view>
			<view class="yhrw-view-list-item">
				<uni-calendar :header-view="{show: false}" :lunar="true" :startDate='weekInfo.startTime' :endDate='weekInfo.endTime' class="uni-calendar--hook" :date="weekInfo.startTime"
					:selected="info.selected" :showMonth="false" @change="change" @monthSwitch="monthSwitch" />
			</view>
			<view class="yhrw-view-list-item">
				<view class="yhrw-view-list-name">养护进度:</view>
				<text class="yhrw-view-list-text">{{diaryInfo.schedule || 0}}%</text>
			</view>
			<view class="yhrw-view-list-item" style="align-items: flex-start;">
				<view class="yhrw-view-list-name">养护内容:</view>
				<view style="word-break: break-all;" class="yhrw-view-list-text">
					{{diaryInfo.maintainContent}}</view>
			</view>
			<view class="" style="display: flex;margin-top: 40rpx;">
				<button type="primary" style="width: 200rpx;" @click="lookImg">查看图片</button>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getMaintainWeekPlan
	} from '@/api/comp/maintainWeekPlan'
	import {
		listQueryWeekList
	} from '@/api/comp/maintainWeekPlan'
	import {
		listMaintainDiary
	} from '@/api/comp/maintainDiary'
	/**
	 * 获取任意时间
	 */
	function getDate(date, AddDayCount = 0) {
		if (!date) {
			date = new Date()
		}
		if (typeof date !== 'object') {
			date = date.replace(/-/g, '/')
		}
		const dd = new Date(date)

		dd.setDate(dd.getDate() + AddDayCount) // 获取AddDayCount天后的日期

		const y = dd.getFullYear()
		const m = dd.getMonth() + 1 < 10 ? '0' + (dd.getMonth() + 1) : dd.getMonth() + 1 // 获取当前月份的日期，不足10补0
		const d = dd.getDate() < 10 ? '0' + dd.getDate() : dd.getDate() // 获取当前几号，不足10补0
		return {
			fullDate: y + '-' + m + '-' + d,
			year: y,
			month: m,
			date: d,
			day: dd.getDay()
		}
	}
	let id = ''
	export default {
		data() {
			return {
				date: new Date(),
				// showCalendar: false,
				info: {
					lunar: true,
					range: true,
					insert: false,
					selected: []
				},
				weekInfo: {},
				diaryInfo:{},
				maintainDiaryList:[]
			}
		},
		onReady() {
			this.getInof()
		},
		onLoad(options){
			if(options){
				id = options.id || ''
			}	
		},
		methods: {
			getInof() {
				listQueryWeekList().then(res => {
					this.weekInfo = res.rows.find(item => item.id === id)
					let startTime = new Date(this.weekInfo.startTime)
					let endTime = new Date(this.weekInfo.endTime)
					if (this.date.getTime() < startTime.getTime()) {
						this.$set(this.weekInfo, 'status', '未开始')
					} else if (this.date.getTime() > startTime.getTime() && this.date.getTime() < endTime
						.getTime() && this.weekInfo.schedule !== '100') {
						this.$set(this.weekInfo, 'status', '养护中')
					} else if (this.date.getTime() > endTime.getTime() && this.weekInfo.schedule !== '100') {
						this.$set(this.weekInfo, 'status', '已结束')
					} else if (this.weekInfo.schedule == '100') {
						this.$set(this.weekInfo, 'status', '已完成')
					}
					listMaintainDiary({
						weekId: id
					}).then(res => {
						res.rows.map(item => {
							if (this.parseTime(startTime, "{y}-{m}-{d}") === this
								.parseTime(item.maintainTime, "{y}-{m}-{d}")) {
									this.diaryInfo = item
							}
						})
						this.maintainDiaryList = res.rows
					})
				})

			},
			open() {
				this.$refs.calendar.open()
			},
			close() {
				console.log('弹窗关闭');
			},
			change(e) {
				this.maintainDiaryList.map(item=>{
					if (this.parseTime(item.maintainTime, "{y}-{m}-{d}") === e.fulldate) {
							this.diaryInfo = item
					}
				})
			},
			confirm(e) {
				console.log('confirm 返回:', e)
			},
			monthSwitch(e) {
				console.log('monthSwitchs 返回:', e)
			},
			lookImg(){
				uni.navigateTo({
					url:'/pages/gardens/yhrw/newimage?id='+this.diaryInfo.id
				})
			},
			backClick() {
				uni.navigateBack()

			}
		}
	}
</script>

<style lang="scss" scoped>
	$nav-height: 30px;

	.box-bg {
		background-color: #F5F5F5;
		padding: 5px 0;
	}

	.city {
		/* #ifndef APP-PLUS-NVUE */
		display: flex;
		/* #endif */
		flex-direction: row;
		align-items: center;
		justify-content: flex-start;
		// width: 160rpx;
		margin-left: 4px;
	}

	.input-uni-icon {
		line-height: $nav-height;
	}

	.gradens-yhrw-view-card {
		box-sizing: border-box;
		padding: 10rpx 10px;
	}

	.gradens-yhrw-view {
		.yhrw-view-list-item {
			display: flex;
			padding-top: 20rpx;
			align-items: center;

			.yhrw-view-list-name {
				width: 125rpx;
				color:#9DA0AA;
				font-size: 24rpx;
			}

			.yhrw-view-list-text {
				flex: 1;
				color:#353B50;
				font-size: 24rpx;
			}
		}
	}
	::v-deep .uni-calendar__backtoday{
		display: none;
	}
</style>